<template>
    <div class="setPwd">
      <div class="header">设置密码</div>
        <div class="input1"><input type="password" placeholder="请输入密码" v-model="pwd" ref="inp1">
            <i @click="disp('i_f','inp1')" ref="i_f" class="iconfont icon-biyan"></i>
        </div>
        <div class="input2"><input type="password" placeholder="请再次输入密码" v-model="repwd" ref="inp2">
            <i @click="disp('i_s','inp2')" ref="i_s" class="iconfont icon-biyan"></i>
        </div>
        <button @click="sure">确定</button>
    </div>
</template>

<script>
import { Toast } from 'mint-ui';

export default {
  name: 'setPwd',
  data() {
    return {
      pwd: '',
      repwd: '',
    };
  },
  methods: {
    async sure() {
      if (this.pwd !== this.repwd) {
        Toast({
          message: '密码不一致,请重新输入',
        });
      } else {
        const pwdFormat = /^[A-Za-z0-9]{6,15}$/;
        if(!(pwdFormat.test(this.pwd))){
            Toast({
                message: '密码格式不正确',
                duration: 1000,
            });

        }else{
            const res = await this.$api.post('/user/set', {
                uid: this.$store.state.userinfo.uid,
                password: this.pwd,
            });
            console.log(res);
            if (res.data.state) {
                Toast({
                    message: '设置密码成功',
                });
                this.$store.commit('updateUserpwd', this.pwd);
                setTimeout(() => { this.$router.replace({ name: 'usercenter' }); }, 2000);
            } else {
                Toast({
                    message: '设置失败'+res.data.info,
                });
            }
        }

      }
    },
      disp(_ref, inp) {
          this.$refs[_ref].className = this.$refs[_ref].className === 'iconfont icon-biyan' ? 'iconfont icon-eyesopen' : 'iconfont icon-biyan';
          this.$refs[inp].type = this.$refs[_ref].className === 'iconfont icon-biyan' ? 'password' : 'text';
      },

  },


};
</script>

<style scoped>

</style>
